var operation = {};
var postPath = '/gdp'

var groupInfoVue = new Vue({
    el: '#main-container',
    data: {

        // 弹窗分组信息
        catalogInfo: {
            catalogId: '',
            catalogName: '',
            remark: ''
        },
        // 操作类型
        optFlag: false,
        // 应用的分组信息
        catalogInfoList: [],
        // 选中的站点信息
        checkedStationList: [],
        // 取消选中的站点信息
        unCheckedStationList: []
    },
    computed: {},

    created: function () {
    },

    watch: {},
    mounted: function () {
        this.initData();
        initStations();
    },
    methods: {
        /**
         * 初始化数据
         */
        initData() {
            // 主键
            let catalogId = this.getQueryString("catalogId");
            if (catalogId && catalogId !== 'null') {
                // 应用id初始化
                this.catalogInfo.catalogId = catalogId;
                // 查询数据
                let resById = this.selectById(catalogId);
                if (!resById) return;
                this.catalogInfo.catalogName = resById.catalogName;
                this.catalogInfo.remark = resById.remark;
                this.checkedStationList = resById.appStationList ? resById.appStationList : [];
                $("#catalogId").val(catalogId)
            }
        },


        showErrorMsg(msg) {
            showMsg(msg, "error");
        },
        /**
         * 将选中的状态改成false
         * @param row
         */
        onUnCheckRow(row) {
            // 从未选中的数据集合中移除掉
            this.checkedStationList = this.checkedStationList.filter(i => row.stcd !== i.stcd);
            // 放在已选中的集合中
            this.unCheckedStationList.push(row);
        },
        /**
         * 添加已选中的数据
         * @param row
         */
        onCheckRow(row) {
            // 从未选中的数据集合中移除掉
            this.unCheckedStationList = this.unCheckedStationList.filter(i => row.stcd !== i.stcd);
            // 放在已选中的集合中
            this.checkedStationList.push(row);
        },


        /**
         * 查询配置
         */
        selectById(catalogId) {
            let resById = null;
            let _this = this;
            $.ajax({
                type: 'GET',
                url: postPath + '/accesscontrol/acAppCatalog/selectList',
                data: {catalogId: catalogId},
                async: false,
                success: function (res) {
                    if (res.success) {
                        resById = res.data[0];
                    } else {
                        showMsg("操作失败,请稍后重试!", "error");
                    }
                }
            });
            return resById;
        },


        searchStations() {
            $("#tb_dataList").bootstrapTable('refresh');
        },

        /**
         * 返回按钮
         */
        backBtn() {
            window.location.href = postPath + "/applicationCode/index"
        },

        //获取Query参数
        getQueryString: function (name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        },
    }
})


/*js Start*/
function initStations() {

    $("#tb_dataList").bootstrapTable({
        url: postPath + '/accesscontrol/acStationInfo/getDataPageByCatalogId',
        undefinedText: '-',
        pagination: true, // 分页
        queryParams: queryParams, // 条件
        striped: true, // 是否显示行间隔色
        cache: false, // 是否使用缓存
        pageList: [10, 20, 40],
        toolbar: "",// 指定工具栏
        showColumns: false, // 显示隐藏列
        showRefresh: false, // 显示刷新按钮
        uniqueId: "appId", // 每一行的唯一标识
        sidePagination: "server", // 服务端处理分页
        onPreBody: function (data) {
            // 主要是要选中页码切换之前选中的数据
            data.forEach(row => {
                let checkedList = groupInfoVue.checkedStationList.filter(i => row.stcd === i.stcd);
                checkedList = checkedList ? checkedList : [];
                let unCheckedList = groupInfoVue.unCheckedStationList.filter(i => row.stcd === i.stcd);
                unCheckedList = unCheckedList ? unCheckedList : [];
                if (checkedList.length >= 1) {
                    // 将选中状态回显
                    row.checkedStatus = true;
                }
                if (unCheckedList.length >= 1) {
                    // 将选中状态回显
                    row.checkedStatus = false;
                }
            })
            return false;
        },
        // 选择框选中事件
        onCheck: function (row) {
            groupInfoVue.onCheckRow(row);
            return false;
        },
        // 当前页全选事件
        onCheckAll: function (rows) {
            rows.forEach(row => {
                groupInfoVue.onCheckRow(row);
            })
            return false;
        },
        // 取消选中事件
        onUncheck: function (row) {
            groupInfoVue.onUnCheckRow(row);
            return false;
        },
        // 当前页取消全选事件
        onUncheckAll: function (rows) {
            rows.forEach(row => {
                groupInfoVue.onUnCheckRow(row);
            })
            return false;
        },
        responseHandler: function (res) {
            return {
                "total": res.data.total,//总页数
                "rows": res.data.rows   //数据
            };
        },
        columns: [
            {
                field: 'checkedStatus',
                checkbox: true,
                align: 'center',
                valign: 'middle'
            },
            {
                title: '测站编码',
                field: 'stcd', // 字段
                align: 'left', // 对齐方式（左 中 右）
                halign: 'center',
                valign: 'middle', //
                sortable: false
            },
            {
                title: '测站名称',
                field: 'stnm', // 字段
                align: 'left', // 对齐方式（左 中 右）
                halign: 'center',
                valign: 'middle', //
                sortable: false
            },
            {
                title: '河流名称',
                field: 'rvnm',
                align: 'left', // 对齐方式（左 中 右）
                halign: 'center',
                valign: 'middle',
                sortable: false
            },
            {
                title: '水系名称',
                field: 'hnnm',
                align: 'center',
                valign: 'middle',
                sortable: false
            },
            {
                title: '流域名称',
                field: 'bsnm',
                align: 'center',
                valign: 'middle',
                sortable: false
            },
            {
                title: '经度',
                field: 'lgtd',
                align: 'left',
                halign: 'center',
                valign: 'middle',
                sortable: false
            },
            {
                title: '纬度',
                field: 'lttd',
                align: 'center',
                valign: 'middle',
                sortable: false
            },
 
            {
                title: '站址',
                field: 'stlc',
                align: 'center',
                valign: 'middle',
                sortable: false
            },
            {
                title: '行政区划码',
                field: 'addvcd',
                align: 'center',
                valign: 'middle',
                sortable: false
            }
        ]
    });

}

/** 查询条件与分页数据 */
function queryParams(pageReqeust) {
    var temp = {
        order: pageReqeust.order,
        pageNum: pageReqeust.offset / pageReqeust.limit + 1,
        pageSize: pageReqeust.limit,
    };
    if ($("#stcd").val()) {
        temp.stcd = $("#stcd").val();
    }
    if ($("#catalogId").val()) {
        temp.catalogId = $("#catalogId").val();
    }
    if ($("#stnm").val()) {
        temp.stnm = $("#stnm").val();
    }
    if ($("#addvcd").val()) {
        temp.addvcd = $("#addvcd").val();
    }
    return temp;
}


function showMsg(text, icon) {
    $.toast().reset('all');
    $.toast({
        text: text,
        icon: icon,
        showHideTransition: 'fade',
        allowToastClose: true,
        hideAfter: 1500,
        stack: false,
        position: 'top-right',
        textAlign: 'left',
        loader: true,
        loaderBg: '#9ec600',
    });
}

/*js End*/


